<template lang="">
    <div>
        <div style="background: #F5F7FB;">
            <van-tabs v-model:active="tab" @click-tab="onClickTab">
                <van-tab title="基本资料" name="zl"></van-tab>
                <van-tab title="随访" name="sf"></van-tab>
                <van-tab title="量表" name="lb"></van-tab>
                <van-tab title="档案" name="da"></van-tab>
                <van-tab title="科研组" name="ky"></van-tab>
            </van-tabs>

            <div class="top">
                <div class="title">
                    <div>科研项目</div> 
                    <van-icon name="arrow-down" />
                </div>
                <div class="top-icon" @click="goToKy"><van-icon style="font-size:25px" name="add-o" /></div>
            </div>

        </div>
    </div>
</template>
<script>
import { ref, reactive,onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { getItem, getItemCate, addItemCate } from "../api/index"
import { getUserInfo, log, LOCAL_USER } from "../utils/user"
import { showToast, showConfirmDialog } from 'vant';
export default {
    setup() {
        const router = useRouter()
        const route = useRoute()
        const userInfo = getUserInfo();

        const tab = ref('ky')
        let pid = 0;
        onMounted(() => {
            pid = route.params.id ? route.params.id : 0
            if(!pid){
                router.push("/Patients")
            }
        })

        const onClickTab = ({ title,name }) => {
            console.log(title,name)
            if(name == 'zl'){
                router.push("/Patient")
            }
        };

        const goToKy = () => {
            router.push("/PatientKy/"+pid)
        }
        return {
            tab,
            onClickTab,
            goToKy 
        }
    }
}
</script>
<style scoped>
.top {
    padding: 15px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background-color: #FFFFFF;
}
.title{
    width: 85%;
    padding: 4px;
    border-radius: 5px;
    background-color: #F5F7FB;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

</style>